<template>
  <div>
	<mt-swipe :auto="5000">
			<mt-swipe-item v-for="(banner, index) in banners" :key="index">
				<a :href="banner.extra.tourl">
					<img :src="banner.imgurl" :title="banner.title">
				</a>
			</mt-swipe-item>
		</mt-swipe>
      
      <mt-cell v-for="(song, index) in songList" :title="song.filename" @click.native="playAudio(index)" :key="index">
			<img src="../assets/images/download_icon.png" width="20" height="20">
		</mt-cell>
  
  </div>
</template>
<script>

import { PLAY_AUDIO} from '@/mixins'
import {newSong} from "@/api"
import { Indicator } from 'mint-ui'
export default{
mixins:[PLAY_AUDIO],
    data(){
        return{
            songList:[],
            banners:[]
        }
    },
    mounted(){
        this.getlist()
   
    },
   
    methods:{
    getlist(){
         Indicator.open({
        text: "拼命加载中...",
        spinnerType: "snake"
      });
        newSong().then(({data})=>{
            // console.log(data)
            Indicator.close();
            this.banners=data.banner
            this.songList=data.data
        })
    }
    } 
 }
</script>

<style>
	.mint-swipe {
		height: 39vw !important;
	}
	
	.mint-swipe-indicator {
		width: 12px !important;
		height: 12px !important;
	}
	
	.mint-swipe-indicators {
		bottom: 5px !important;
	}
</style>
